<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>1.localStorage</title>
</head>

<body>
    <button onclick="savePerson()">向localStorage中存入一个人</button><br><br>
    <button onclick="getPerson()">向localStorage中读取对应的Value</button><br><br>
    <button onclick="deletePerson()">从localStrage中通过Key去删除一组记录</button><br><br>
    <button onclick="deleteAll()">清空所有localStorage中的信息</button><br><br>
    <script type="text/javascript">
        let person = {
            name: '圆圆的峰峰',
            age: 18,
            gender: '女'
        }
        //存入 setItem
        function savePerson() {
            localStorage.setItem('person', JSON.stringify(person))
        }
        //读取 getItem
        function getPerson() {
            const result = localStorage.getItem('person')
            console.log(JSON.parse(result))
        }
        //从localStorage中删除一组Person remoeItem
        function deletePerson() {
            localStorage.removeItem('3')
        }
        //清空所有localStorage中的信息
        function deleteAll() {
            localStorage.clear()
        }
    </script>
</body>

</html>